<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>加入人员</title>
    <link rel="stylesheet" type="text/css" href="../lib/ext/resources/css/ext-all-neptune.css"/>
    <script type="text/javascript" src="../lib/ext/ext-all.js"></script>
</head>
<script type="text/javascript">

var role_id = "0";
var _urlparams = Ext.urlDecode(document.URL.split("?")[document.URL.split("?").length - 1]);
if(_urlparams && _urlparams._id){
    role_id =  _urlparams._id;
}


Ext.Loader.setConfig({enabled: true});

Ext.Loader.setPath('Ext.ux', '/ext4/ux/');
Ext.require([
    'Ext.grid.*',
    'Ext.data.*',
    'Ext.util.*',
    'Ext.toolbar.Paging',
    'Ext.ModelManager',
    'Ext.tip.QuickTipManager'
]);

Ext.onReady(function () {
    var win, searchForm;
    Ext.define('UserModel', {
        extend: 'Ext.data.Model',
        fields: [
            '_id','username','real_name'
        ],
        idProperty: '_id'
    });

    // create the Data Store
    var store = Ext.create('Ext.data.Store', {
        pageSize: 20,
        model: 'UserModel',
        remoteSort: true,
        proxy: {
            type: 'ajax',
            url: '/role/user/list?role_id='+role_id,
            reader: {
                type: 'json',
                root: 'data',
                totalProperty: 'count'
            },
            // sends single sort as multi parameter
            simpleSortMode: true
        },
        sorters: [
            {
                property: 'create_date',
                direction: 'DESC'
            }
        ]
    });

    searchForm = new Ext.FormPanel({
        id:'search_form',
        labelWidth: 75, // label settings here cascade unless overridden
        region: 'north',
        defaultType: 'textfield',
        items: [
            {
                id:"username",
                fieldLabel: '用户名',
                name: 'username',
                allowBlank: false
            },{
                fieldLabel: '真实姓名',
                name: 'real_name',
                allowBlank: true
            }
        ]
    });

    //关闭窗口
    function doClose(){
        parent.closeWin();
    }

    var grid = Ext.create('Ext.grid.Panel', {
        store: store,
        loadMask: true,
        region: 'center',
        selModel: Ext.create('Ext.selection.CheckboxModel'),
        columns: [
            {
                text: "_id",
                dataIndex: '_id',
                hidden: true,
                sortable: false
            },
            {
                text: "用户名",
                dataIndex: 'username',
                width: 100,
                sortable: true
            },
            {
                text: "真实姓名",
                dataIndex: 'real_name',
                width: 100,
                sortable: true
            }
        ],
        // paging bar on the bottom
        bbar: Ext.create('Ext.PagingToolbar', {
            store: store,
            displayInfo: true,
            displayMsg: 'Displaying {0} - {1} of {2}',
            emptyMsg: "没有数据！！！"

        }),
        tbar: [

            {
                pressed: true,
                icon : '../img/add.png',
                text: "添  加",
                handler: doAdd
            },
            {
                pressed: true,
                icon : '../img/delete.png',
                text: "移  出",
                handler: doDel
            },
            {
                pressed: true,
                icon : '../img/close.png',
                text: "关  闭",
                handler: doClose
            }

        ]
    });


    var viewport = new Ext.Viewport({
                layout: 'border',
                renderTo: "topic-grid",
                items: [searchForm,grid]}
    );

    function doSearch(){
        store.loadPage(1,{params:searchForm.getValues()});
    }

    function showHandlerWin(url){
        win = null;
        if (!win) {
            win = Ext.create('widget.window', {
                title: '业务办理',
                header: {
                    titlePosition: 2,
                    titleAlign: 'center'
                },
                closable: true,
                closeAction: 'hide',
                width: 800,
                height: 650,
                html : '<iframe width="100%" height="100%" frameborder="0" src="' + url + '"></iframe>'
            });
        }
        win.show();
    }
    function doEdit() {
        var orows = grid.getSelectionModel().getSelection();
        console.log(orows);
        if(orows.length == 0){
            Ext.MessageBox.show({title: "消息提示",
                msg: "请选择一条记录",
                width: 200,
                icon: Ext.MessageBox.INFO
            });
            return;
        }
        console.log(orows[0].data._id);
        var url = "/admin/busi_handler/add.html?_id=" + orows[0].data._id;
        showHandlerWin(url);
    }
    function doAdd(){
        param_values = searchForm.getValues();
        param_values.role_id = role_id;
        if(param_values.username=="") {
            Ext.getCmp('username').focus();
            Ext.MessageBox.alert('消息提示','用户名不能为空！');
        }else {
            Ext.Ajax.request({
                url:'/role/user/save',
                params:param_values,
                method:'POST',
                success:function(response,options) {
                    var data = Ext.decode(response.responseText);
                    if(data.flag == "success") {
                        Ext.MessageBox.alert('消息提示', '操作成功！');
                        Ext.getCmp('search_form').getForm().reset();
                        store.loadPage(1);
                    }else {
                        Ext.MessageBox.alert('消息提示', data.msg);
                    }

                },
                failure:function(response,options) {
                    Ext.MessageBox.alert('消息提示', '操作失败！');
                }
            });
        }
    }

    function doDel() {
        var orows = grid.getSelectionModel().getSelection();
        if(orows.length == 0){
            Ext.MessageBox.show({title: "消息提示",
                msg: "请选择要移出的记录",
                width: 200,
                icon: Ext.MessageBox.INFO
            });
            return;
        }
        Ext.MessageBox.confirm('消息提示', '确定要移出所选对象？', function (btn) {
            if (btn == "yes") {
                var orows = grid.getSelectionModel().getSelection();
                var ids = "";
                for(var i=0;i<orows.length;i++) {
                    ids += orows[i].get('_id');
                    ids += "#";
                }
                if(ids!=""&&ids.length>0) {
                    ids = ids.substring(0,ids.length-1);
                }
                Ext.Ajax.request({
                    url: '/role/user/del',
                    params: {ids: ids,'role_id':role_id},
                    method: 'POST',
                    success: function (response, options) {
                        Ext.MessageBox.alert('消息提示', '操作成功！');
                        store.loadPage(1);
                    },
                    failure: function (response, options) {
                        Ext.MessageBox.alert('消息提示', '操作失败！');
                    }
                });
            }
        })

    }

    // trigger the data store load
    store.loadPage(1);
    window.refresh = function(){
        store.loadPage(1);
    }

    window.closeWin = function(){
        win.hide();
    }
});
</script>
<body>
<div id="topic-grid" style="height: 1024px;width:100%"></div>
<p>The js is not minified so it is readable. See <a href="panel.js">panel.js</a>.</p>
</body>
</html>